<script lang="ts" setup>
	import { ref } from "vue";
	import categroy from "@/components/category/category.vue"
	// import classifyData from '@/components/category/testData';
	import {
		getCurrentInstance
	} from 'vue'
	import router from "../../../router";
	const {
		proxy,
	} = getCurrentInstance()
	let classifyData = ref([])
	let searchWord = ref('')
	const getData = function () {
		proxy.$req('GET', proxy.$api.shopAllScreen, {
			isType: 0
		}).then((res) => {
			console.log(res);
			classifyData.value = res.result
		})
	}();
	const screenClick = (e) => {
		console.log(e.parentName);
		console.log(e.id);
		console.log(e.name);
		let type = 0
		if (e.parentName == '仪器租赁') {
			type = 1
		}
		router.push({
			name: 'classGoodsList',
			params: {
				id: e.id,
				name: e.name,
				type,
			}
		})
	}
	const goSearch = (e) => {
		router.push({
			name: e,
			params: {
				isType: 0
			}
		})
	}
</script>
<template>
	<view class="navbar">
		<u-navbar :placeholder="true" bgColor="rgba(0,0,0,0)" title="分类"
			title-style="font-size: 36rpx;font-weight: 500;" autoBack>
		</u-navbar>
		<view class="" @click="goSearch('searchPageShop')">
			<u-search placeholder="搜索商品名称" v-model="searchWord" :showAction="false" bgColor="#fff"></u-search>
		</view>
	</view>
	<view class="fenlei" v-if="classifyData.length>0">
		<categroy :screenData="classifyData" @itemClick="screenClick"></categroy>
	</view>
</template>
<style lang="scss">
	page {
		background-color: #FAFAFA;
	}

	.navbar {
		width: calc(100% - 64rpx);
		padding: 0 32rpx;
		height: 392rpx;
		background-image: url('../../../static/images/communityBg.png');
		background-size: 100% 100%;
	}

	.fenlei {
		width: 100%;
		padding: 30rpx 0;
		margin-top: -220rpx;
		position: relative;
	}
</style>